<template>
  <div class="app-cinema-poster">
    <div class="poster">
      <app-intro-big-item></app-intro-big-item>
    </div>
    <div class="centre">
      <div class="date active">今天11月29日</div>
      <div class="date">今天11月30日</div>
      <div class="date">今天11月31日</div>
    </div>
    <div class="cinemalist">
      <app-cinema-list></app-cinema-list>
    </div>
  </div>
</template>

<script>
import AppIntroBigItem from "@com/common/AppIntroBigItem";
import AppCinemaList from "@com/common/AppCinemaList";

export default {
  name: "AppCinemaPoster",
  components: {
    AppIntroBigItem,
    AppCinemaList
  }
};
</script>

<style lang="scss">
.app-cinema-poster {
  .poster {
    height: auto;
  }

  .centre {
    height: 1.2rem;
    display: flex;

    .date {
      position: relative;
      width: 3.066667rem;
      line-height: 1.146667rem;
      margin-left: 0.12rem;
      font-size: 0.373333rem;
      text-align: center;
      color: #666;
    }

    .date.active {
      border-bottom: 0.053333rem solid #f03d37;
      color: #f03d37;
    }
  }
}
</style>
